let yesButton = document.getElementById("yes");
let noButton = document.getElementById("no");
let questionText = document.getElementById("question");
let mainImage = document.getElementById("mainImage");

let clickCount = 0;  // 点击 No 按钮的次数

// No 按钮的互动文本（西班牙语）
const noTexts = [
    "真的吗？",        // 真的吗？
    "真的要这样吗？？？",     // 你不信我？
    "不准选这个···",      // 别这样对我...
    "我求你了...",     // 我求你了...
    "原谅我好不好，求求啦·····"                // 哭脸
];

// No 按钮点击事件
noButton.addEventListener("click", function() {
    clickCount++;

    // Yes 按钮逐渐放大
    let yesSize = 1 + (clickCount * 1.2);
    yesButton.style.transform = `scale(${yesSize})`;

    // No 按钮逐渐右移
    let noOffset = clickCount * 50;
    noButton.style.transform = `translateX(${noOffset}px)`;

    // 图片和文字整体上移
    let moveUp = clickCount * 25;
    mainImage.style.transform = `translateY(-${moveUp}px)`;
    questionText.style.transform = `translateY(-${moveUp}px)`;

    // 更新 No 按钮文本（前5次点击）
    if (clickCount <= 5) {
        noButton.innerText = noTexts[clickCount - 1];
    }

    // 更新图片（根据点击次数切换）
    if (clickCount === 1) mainImage.src = "images/shocked.png";   // 惊讶
    if (clickCount === 2) mainImage.src = "images/think.png";     // 思考
    if (clickCount === 3) mainImage.src = "images/angry.png";     // 生气
    if (clickCount === 4) mainImage.src = "images/crying.png";    // 哭泣
    if (clickCount >= 5) mainImage.src = "images/crying.png";     // 持续哭泣
});

// Yes 按钮点击事件（显示成功画面）
yesButton.addEventListener("click", function() {
    document.body.innerHTML = `
        <div class="yes-screen">
            <h1 class="yes-text">！！！我就知道你会原谅我的 ( >ㅅ<)ﾉ</h1>
            <img src="images/hug.png" alt="拥抱" class="yes-image">
        </div>
    `;
    document.body.style.overflow = "hidden";
});